<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>提交订单</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="stylesheet" href="{$smarty.const.PUBLIC_PATH}css/amazeui.min.css"/>
<link rel="stylesheet" href="{$smarty.const.IMAGES_PATH}style.css"/>
<script src="{$smarty.const.PUBLIC_PATH}js/jquery.min.js"></script>
<script src="{$smarty.const.PUBLIC_PATH}js/amazeui.min.js"></script>
</head>

<body>
<div class="container" >
	<!--引入头文件-->
	{include file="../header.html"}
	<script>$('.title-link').text("修改地址")</script>

	<div class="gray-panel" >
    	
        <div class="paoduct-title-panel">
        	<h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">1</span> 添加收货地址</h2>
            <p><i class="am-icon-location-arrow"></i> 收货地址</p>
            <form class="am-form am-form-inline" style="margin-bottom: 200px;" action="{$smarty.const.__SELF__}" method="post" onsubmit="return mySubmit()" data-am-validator>
            <p><select name="province" class="select-area am-radius selprovince" style="margin-right:13px!important;" required>
            	{foreach $provinces as $k=>$v}
            	<option value="{$v.province}" data-provinceid="{$v.provinceid}" {if $v.province==$address.province}selected="selected"{/if}>{$v.province}</option>
            	{/foreach}
            </select>
            	<select name="city" class="select-area am-radius selcity" style="margin-right:13px!important;" required>
            		<option value="{$address.city}" selected="selected">{$address.city}</option>
            		
            	</select>
            	<select name="town" class="select-area am-radius selarea" required>
            		<option value="{$address.town}" selected="selected">{$address.town}</option>
            		
            	</select></p>
            <div class="am-form-group" style="width: 95.5%;margin-top: 15px;">
                <input type="text" class="am-form-field am-radius" name="detail" id="detail" placeholder="详细地址" value="{$address.detail}" required>
            </div>
            <hr data-am-widget="divider" style="" class="am-divider-default am-margin-bottom-sm"/>
            <div class="am-form-group am-form-icon" style="width: 60%;">
                <i class="am-icon-user"></i>
                <input type="text" class="am-form-field am-radius" name="name" id="truename" placeholder="真实姓名" value="{$address.name}"  minlength="2" maxlength="8" required>
            </div>
            <div class="am-form-group am-form-icon" style="width: 60%;margin-top: 15px;">
                <i class="am-icon-phone"></i>
                <input type="number" class="am-form-field am-radius js-pattern-mobile" name="phone" id="phone" placeholder="手机号码" value="{$address.phone}"  required>
            </div>
            <div style="text-align: center;margin-top: 85px;position: relative;width: 100%;">
            	<button type="submit" class="am-btn am-btn-danger am-btn-block am-radius submit" style="width:60%;position: absolute; left: 20%;">提交</button>
            </div>
            </form>
        </div>
        
    </div>
    
    <footer data-am-widget="footer" class="am-footer am-footer-default" data-am-footer="{  }">
        <hr data-am-widget="divider" style="" class="am-divider am-divider-default"/>
      <div class="am-footer-miscs ">
        <p>CopyRight©2014 AllMobilize Inc.</p>
        <p>京ICP备13033158</p>
      </div>
    </footer>
    <!--底部-->
    {include file="../footer.html"}
</div>
<script>
window.onload=function(){
  if ($.AMUI && $.AMUI.validator) {
    $.AMUI.validator.patterns.mobile = /^1((3|5|8){1}\d{1}|70)\d{8}$/;
  }
}
//正则验证手机号
	function mySubmit(){
		var reg=/^[1][3,4,5,7,8][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]/;
		if(!reg.test($("#phone").val())){
			$("#phone").parent().removeClass("am-form-success").addClass("am-form-error");
			return false;
		}
	}
	$('.selprovince').change(function(){
		//<option>选择市</option>
		//alert($('.selprovince').val());
		$(".selcity").empty();
		$(".selarea").empty();
		var data={
				provinceid:$('.selprovince').find("option:selected").data('provinceid'),
			};
		$.post("{$smarty.const.__CONTROLLER__}/getcity", data, function(ret){
				console.log(ret);
				for(i=0;i<ret.length;i++){
					$('.selcity').append("<option data-cityid='"+ret[i]['cityid']+"'>"+ret[i]['city']+"</option>");
				}
//		$('.selcity').append("<option value='"+3+"'>"+"嘻嘻"+"</option>");
			})
	})
	$('.selcity').change(function(){
		//<option>选择市</option>
		//alert($('.selprovince').val());
		$(".selarea").empty();
		var data={
				cityid:$('.selcity').find("option:selected").data('cityid'),
			};
		$.post("{$smarty.const.__CONTROLLER__}/getarea", data, function(ret){
				console.log(ret);
				for(i=0;i<ret.length;i++){
					$('.selarea').append("<option data-areaid='"+ret[i]['areaid']+"'>"+ret[i]['area']+"</option>");
				}
//		$('.selcity').append("<option value='"+3+"'>"+"嘻嘻"+"</option>");
			})
	})
//	$('.submit').click(function(){
////		alert({$address.uid});
//		var data={
//					uid:{$address.uid},
//					name:$("#truename").val(),
//					phone:$("#phone").val(),
//					province:$(".selprovince").find("option:selected").text(),
//					city:$(".selcity").find("option:selected").text(),
//					town:$(".selarea").find("option:selected").text(),
//					detail:$("#detail").val(),
//				};
//				console.log(data);
//				$.post("{$smarty.const.__CONTROLLER__}/editaddress", data, function(ret){
//					console.log(ret);
//				})
//			})
</script>
</body>
</html>
